<template>
  <el-dialog :visible.sync="dialogVisible" :fullscreen="true">
    <el-row class="el-low-c" type="flex" justify="start" align="middle">
      <el-col class="el-span-c">
        <span>代号</span>
      </el-col>
      <el-col class="el-input-normal-c">
        <el-input v-model="domainmodelInJson.Code"></el-input>
      </el-col>
      <el-col class="el-span-c">
        <span>名称</span>
      </el-col>
      <el-col class="el-input-normal-c">
        <el-input v-model="domainmodelInJson.Name"></el-input>
      </el-col>
      <el-col class="el-span-c">
        <span>类别</span>
      </el-col>
      <el-col class="el-input-normal-c">
        <DomainTypeSelector v-model="domainmodelInJson.Type"/>
      </el-col>
    </el-row>
    <div
      slot="title"
      style="border-bottom: 1px dashed #dcdfe6;font-size: larger;padding-bottom: 10px;"
    >
      <span>数据管理</span>
      <hr style="border:1 dashed " width="100%" color="#DCDFE6" size="1">

      <div>
        <el-button-group>
          <el-button size="mini" type="primary" @click="onSubmit">保存</el-button>
          <el-button size="mini" :disabled="delDisable" @click="onDelete">删除</el-button>
        </el-button-group>
        <el-button-group>
          <el-button size="mini" @click="dialogVisible = false">关闭</el-button>
        </el-button-group>
      </div>
    </div>
    <div slot="footer" style="border-top: 1px dashed #dcdfe6;font-size: larger;padding-top: 10px;"></div>
  </el-dialog>
</template>
<script>
import DomainTypeSelector from '@/components/Selector/DomainTypeSelector.vue'
import { delDomain, setDomain } from '@/api/domain'
import { Model } from 'vue-property-decorator'

export default {
  components: {
    DomainTypeSelector
  },
  data() {
    return {
      dialogVisible: false,
      domainmodelInJson: {}
    }
  },
  watch: {
    domainmodel: function(value) {
      this.domainmodelInJson = value
    }
  },
  computed: {
    delDisable: function() {
      return (
        this.domainmodelInJson.AutoId === undefined ||
        this.domainmodelInJson.AutoId === 0
      )
    }
  },
  props: { domainmodel: Object },
  methods: {
    onSubmit() {
      setDomain(this.domainmodelInJson)
        .then(response => {
          if (response.Result === 0) {
            this.domainmodelInJson = response.Data
            this.$message('保存成功')
            this.regDisable = false
            this.$emit('domainSaveComplete', this.domainmodelInJson)
          } else {
            this.$alert(response.Message, '失败')
          }
        })
        .catch(error => {
          // this.$alert(error, '错误')
        })
    },
    onDelete() {
      delDomain(this.domainmodelInJson)
        .then(response => {
          if (response.Result === 0) {
            this.$message('删除成功')
            ;(this.dialogVisible = false),
              this.$emit('domainDelComplete', this.domainmodelInJson.AutoId)
            this.domainmodelInJson = {}
          } else {
            this.$alert(response.Message, '失败')
          }
        })
        .catch(error => {
          // this.$alert(error, '错误')
        })
    }
  }
}
</script>

<style>
.el-span-c {
  padding: 5px;
  height: 40px;
  width: 100px;
  line-height: 30px;
  text-align: right;
}
.el-input-normal-c {
  width: 300px;
  height: 40px;
  text-align: left;
}
.el-input-large-c {
  width: 500px;
  height: 40px;
  text-align: left;
}
.el-low-c {
  height: 40px;
  margin-bottom: 15px;
  text-align: left;
}
</style>